<template>
    <div class="content">
        <div class="table-content">
            <!--搜索组件-->
            <Search v-show="searchShow" :course="courseOption" :examTime="examTime" @searchParams="searchParams"
                    @downData="downData"
                    @reset="getTableData"></Search>
            <!--表格组件-->
            <Table style="margin-top: 10px" @loading="getTableData" :currentOrg="currentOrg" @search="searchIsShow" @ItemCheckSuccess="ItemCheckSuccess" :table-data="tableData"></Table>
        </div>
        <!--分页组件-->
                    <el-pagination
                            style="margin-top: 10px;margin-bottom: 40px;"
                            background
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page.sync="currentPage"
                            :page-sizes="[5, 10, 15, 20]"
                            :page-size="pageSize"
                            layout="total,sizes, prev, pager, next,jumper"
                            :total="total">
                    </el-pagination>
    </div>
</template>

<script>
    import {courselist, downCsv, getOrg, getOrg2} from "../../../request/api";
    import Search from "../../../components/search/Search";
    import Table from "../../../components/table/Table";
    import page from "../../../components/page/page";
    import {studentList} from "../../../request/api";

    export default {
        name: "index",
        props: {
            // pageSize: {
            //     type: Number
            // },
            // currentPage: {
            //     type: Number
            // }
        },
        data() {
            return {
                //搜索组件搜索框显示隐藏
                searchShow: true,
                // 每页页数
                pageSize: 10,
                // 当前页
                currentPage: 1,
                //总条数
                total: 0,
                //表格数据
                tableData: [],
                //课程集合
                courseOption: [],
                //考试时间集合
                examTime: [],
                //当前机构
                currentOrg:{},
                params:null
            }
        },
        methods: {
          //获取当前机构详情信息
          getOrgMessage(){
            getOrg().then(res =>{
              console.log('当前机构信息',res)
              this.currentOrg = res;
            })
          },
          //下载导出
          downData(Downparams,currentData) {
            console.log(currentData)
            const dataOptions = currentData;
            let fields = [];
            // let header = [];
            let params = {};
            // for (let item of Downparams) {
            //   for (let key in item) {
            //     params[key] = item[key];
            //   }
            // }
            for (let item of dataOptions){
              fields.push(item)
              // header.push(item.value)
            }
            params.fields = fields;
            // params.header = header;
            console.log(params)
            downCsv(params).then(res => {
              console.log(res);
              window.location.href = res.link;
            });
          },
            //每页展示条数
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
                this.pageSize = val;
                let params = {page_size: this.pageSize, page: this.currentPage};
                if(this.tableParams){
                    for (let item of this.tableParams){
                        for (let key in item){
                            params[key] = item[key]
                        }
                    }
                }
                this.getTableData(params);
            },
            // 第几页
            handleCurrentChange(val) {
                this.currentPage = val;
                let params = {page_size: this.pageSize, page: this.currentPage};
                if(this.tableParams){
                    for (let item of this.tableParams){
                        for (let key in item){
                            params[key] = item[key]
                        }
                    }
                }
                this.getTableData(params);
            },
            //获取所有表格数据
            getTableData(params) {
                if(params){
                    studentList(params).then(res => {
                        this.tableData = res.results;
                        this.total = res.total;
                    })
                }else{
                    studentList({page_size: this.pageSize, page: this.currentPage}).then(res => {
                        console.log('all')
                        console.log(res);
                        this.tableData = res.results;
                        this.total = res.total;
                    })
                    this.tableParams = null;
                }
            },
            //根据查询参数查询结果
            searchParams(searchParams) {
                let params = {page_size: this.pageSize, page: this.currentPage};
                for (let item of searchParams) {
                    for (let key in item) {
                        params[key] = item[key];
                    }
                }
                this.tableParams = searchParams;
                this.getTableData(params);
            },
            //控制搜索组件显示隐藏
            searchIsShow(show) {
                this.searchShow = show
            },
            //获取科目信息
            getCourseList() {
                courselist().then(res => {
                    console.log('课程内容', res);
                    let arr = []
                    for (let item of res) {
                        for (let key in item.addr_date) {
                            let obj = {}
                            obj[key] = item.addr_date[key]
                            arr.push(obj[key])
                        }
                    }
                    console.log('examTime', arr);
                    this.examTime = arr;
                    this.courseOption = res
                    console.log('course', this.courseOption)
                })
            },
            //审核通过重新渲染表格数据
            ItemCheckSuccess() {
                let params = {page_size: this.pageSize, page: this.currentPage};
                if(this.tableParams){
                    for (let item of this.tableParams){
                        for (let key in item){
                            params[key] = item[key]
                        }
                    }
                    this.getTableData(params);
                    this.tableParams = null;
                }else{
                    this.getTableData(params);
                }
            }
        },
        watch: {
            // pageSize() {
            //     console.log('传递参数', this.currentPage, this.pageSize)
            //     this.getTableData({page_size: this.pageSize, page: this.currentPage});
            // },
            // currentPage() {
            //     console.log('传递参数', this.currentPage, this.pageSize)
            //     this.getTableData({page_size: this.pageSize, page: this.currentPage});
            // }
        },
        created() {
            this.getTableData({page_size: this.pageSize, page: this.currentPage});
            console.log('传递参数', this.currentPage, this.pageSize)
            this.getCourseList();
            this.getOrgMessage();
        },
        components: {
            Search,
            Table,
            page
        }
    }
</script>

<style>
    .box-card {
        width: 100%;
    }
</style>

<style scoped>
    .content {
        height: 100%;
    }
</style>
